
<template>
<div>
    <div id="Top" style="padding:20px">
        <img class="img" src="https://image.hongbeibang.com/Fm8ItfvW_G-VoT7XyqdeiIFFqEwL?1280X719&imageView2/1/w/750/h/420" alt="">
    </div>
    <div id="title">
        <h3>新手烘焙专题：从入门到精通</h3>
        <p>1000+人在学</p>
    </div>
    <div id="button">
        <link
            rel="stylesheet"
            href="https://cdn.jsdelivr.net/npm/vant@2.10/lib/index.css"
        />
       <van-button @click="toMoney" color="linear-gradient(to right, #ff6034, #ee0a24)">
            渐变色按钮
        </van-button>
    </div>
</div>
</template>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6/dist/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vant@2.10/lib/vant.min.js"></script>
<script>
import Vue from 'vue';
import { Button } from 'vant';

Vue.use(Button);
import vant from 'vant'
export default {
 data () {
return {
}
 },
 mounted () {
     
},
methods :{
    toMoney(){
         this.$router.push('/Money')
     }
}
}
</script>

<style lang="scss" scoped>
#Top{
    .img{
        width: 100%;
        height: 200px;
        overflow: hidden;
    }
}
#button{
    width: 100px;
    height: 100px;
}
</style>
